<template>
  <div>
    <section class="jumbotron">
        <h3 class="jumbotron-heading">Search Github Users</h3>
        <div>
            <input type="text" placeholder="enter the name you search" v-model="inputKey" />&nbsp;
            <button @click="searchUsers">Search</button>
        </div>
    </section>
  </div>
</template>

<script>
export default {
    name:'Search',
    data() {
        return {
            inputKey: ''
        }
    },
    methods: {
        searchUsers() {
            this.$http.get(`http://api.github.com/search/users?q=${this.inputKey}`).then((result) => {
                console.log(result)
                this.$bus.$emit('getUserList',result.data.items)
            }).catch((err) => {
                console.log(err.message)
            });
        }
    }
}
</script>

<style>

</style>